// 导入必要的库
import html2canvas from 'html2canvas';

// 假设这是你的代码字符串
const codeString = `
<template>
  <!-- ... existing code ... -->
</template>

<script setup name="Area">
</script>
`;

// 创建一个div元素用于显示代码
const codeDiv = document.createElement('div');
codeDiv.innerHTML = `<pre><code>${codeString}</code></pre>`;
document.body.appendChild(codeDiv);

// 使用html2canvas将div转换为canvas图像
html2canvas(codeDiv).then(canvas => {
  // 将canvas转换为图片
  const imgData = canvas.toDataURL("image/png");
  const img = document.createElement('img');
  img.src = imgData;
  document.body.appendChild(img);
  
  // 移除原始div
  document.body.removeChild(codeDiv);
});